﻿
@using IOA.MES.DataAccess.Enum
@{
    ViewBag.Title = "物料报表";
    Layout = "~/Views/Shared/_LayoutPage.cshtml";
}
@section Contents{
    <style>
        .layui-form-label {
            width: auto;
        }
    </style>
}

<div id="page"></div>

<script type="text/template" id="tplPage">
    <div class="layui-fluid">
        <div class="layui-card">
            <form class="layui-form layui-card-header layuiadmin-card-header-auto">
                <div class="layui-form-item">
                    <div class="layui-inline">
                        <label class="layui-form-label" v-html="lang.Field.OrderNo">订单号：</label>
                        <div class="layui-input-inline">
                            <input type="text" name="orderNo" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label" v-html="lang.Field.WorkorderNo">工单号：</label>
                        <div class="layui-input-inline">
                            <input type="text" name="workOrderNo" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label" v-html="lang.Field.CabinetNo">柜号：</label>
                        <div class="layui-input-inline">
                            <input type="text" name="cabinetNo" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label" v-html="lang.Field.PackNo">箱号：</label>
                        <div class="layui-input-inline">
                            <input type="text" name="packNo" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label" v-html="lang.Field.BarCode">组件条码：</label>
                        <div class="layui-input-inline">
                            <input type="text" name="barCode" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-inline">
                        <button class="layui-btn layuiadmin-btn-list" type="button" lay-submit lay-filter="search">
                            <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
                        </button>
                        <button class="layui-btn layuiadmin-btn-list layui-btn-normal" type="button" lay-submit lay-filter="export">
                            <i class="layui-icon layui-icon-download-circle layuiadmin-button-btn"></i>
                        </button>
                    </div>
                </div>
            </form>
        </div>

        <div class="layui-card">
            <div class="layui-card-body">
                <table id="table" lay-filter="table"></table>
            </div>
        </div>
    </div>
</script>

@section Scripts{
    <script>
        var vm = new Vue({
            el: "#page",
            template: "#tplPage",
            data: {
                lang: JSON.parse(lang).package
            }
        });

        setTimeout(function () {
            initLayui();
        }, 50);

        function initLayui() {
            layui.use(['table', 'layer', 'form', 'laydate'], function () {
                var layer = layui.layer,
                    table = layui.table,
                    form = layui.form;

                var options = {
                    elem: '#table'
                    , url: '/Report/QueryMaterioaReport'
                    , method: "post"
                    , where: { orderNo: "", workOrderNo: "", cabinetNo: "", packNo: "", barCode: "" }
                    , page: {
                        limit: 15
                        , limits: [15, 20, 25, 30, 40, 50]
                    }
                    , response: {
                        statusName: 'ErrCode'
                        , statusCode: 200
                        , msgName: 'ErrCode'
                        , countName: 'TotalCount'
                        , dataName: 'Data'
                    }
                    , cols: [[
                        { title: '序号', type: "numbers", width: 60, fixed: "left" }
                        , { field: 'BarCode', title: '组件条码', minWidth: 200, fixed: "left" }
                        , { field: 'WorkshopName', title: '生产车间', minWidth: 100 }
                        , { field: 'OrderNo', title: '订单号', minWidth: 150 }
                        , { field: 'WorkOrderNo', title: '工单号', minWidth: 200 }
                        , { field: 'CabinetNo', title: '柜号', minWidth: 150 }
                        , { field: 'PackNo', title: '箱号', minWidth: 200 }
                        , { field: 'ProductCode', title: '成品料号', minWidth: 150 }
                        , { field: 'ProductSpecs', title: '成品规格', minWidth: 250 }
                        , { field: 'BatteryCode', title: '电池片料号', minWidth: 100 }
                        , { field: 'BatterySpecs', title: '电池片规格', minWidth: 100 }
                        , { field: 'BatteryCompany', title: '电池片厂家', minWidth: 100 }
                        , { field: 'BatteryBatchNo', title: '电池片批次号', minWidth: 100 }
                        , { field: 'GlassCode', title: '玻璃料号', minWidth: 100 }
                        , { field: 'GlassSpecs', title: '玻璃规格', minWidth: 100 }
                        , { field: 'GlassCompany', title: '玻璃厂家', minWidth: 100 }
                        , { field: 'GlassBatchNo', title: '玻璃批次号', minWidth: 100 }
                        , { field: 'BackPlanCode', title: '背板料号', minWidth: 100 }
                        , { field: 'BackPlanSpecs', title: '背板规格', minWidth: 100 }
                        , { field: 'BackPlanCompany', title: '背板厂家', minWidth: 100 }
                        , { field: 'BackPlanBatchNo', title: '背板批次号', minWidth: 100 }
                        , { field: 'EvaCode', title: 'EVA料号', minWidth: 100 }
                        , { field: 'EvaSpecs', title: 'EVA规格', minWidth: 100 }
                        , { field: 'EvaCompany', title: 'EVA厂家', minWidth: 100 }
                        , { field: 'EvaBatchNo', title: 'EVA批次号', minWidth: 100 }
                        , { field: 'RibbonCode', title: '焊带料号', minWidth: 100 }
                        , { field: 'RibbonSpecs', title: '焊带规格', minWidth: 100 }
                        , { field: 'RibbonCompany', title: '焊带厂家', minWidth: 100 }
                        , { field: 'RibbonBatchNo', title: '焊带批次号', minWidth: 100 }
                        , { field: 'LongFrameCode', title: '长边框料号', minWidth: 100 }
                        , { field: 'LongFrameSpecs', title: '长边框规格', minWidth: 100 }
                        , { field: 'LongFrameCompany', title: '长边框厂家', minWidth: 100 }
                        , { field: 'LongFrameBatchNo', title: '长边框批次号', minWidth: 100 }
                        , { field: 'ShortFrameCode', title: '短边框料号', minWidth: 100 }
                        , { field: 'ShortFrameSpecs', title: '短边框规格', minWidth: 100 }
                        , { field: 'ShortFrameCompany', title: '短边框厂家', minWidth: 100 }
                        , { field: 'ShortFrameBatchNo', title: '短边框批次号', minWidth: 100 }
                        , { field: 'BoxCode', title: '接线盒料号', minWidth: 100 }
                        , { field: 'BoxSpecs', title: '接线盒规格', minWidth: 100 }
                        , { field: 'BoxCompany', title: '接线盒厂家', minWidth: 100 }
                        , { field: 'BoxBatchNo', title: '接线盒批次号', minWidth: 100 }
                        , {
                            title: '操作', width: 120, fixed: "right", templet: function (d) {
                                var str = '<button class="layui-btn layui-btn-sm layui-btn-normal" onclick="detail(\'' + d.BarCode + '\')"><i class="layui-icon">&#xe614;</i>查看详情</button>';
                                return str;
                            }
                        }
                    ]]
                };

                form.on("submit(search)", function (form) {
                    queryTable(form.field);
                });

                form.on("submit(export)", function (form) {
                    var hasParams = false;
                    var params = new Array();
                    for (var item in form.field) {
                        params.push(item + "=" + form.field[item].trim());
                        if (form.field[item].trim() != '') {
                            hasParams = true;
                        }
                    }
                    if (!hasParams) {
                        return layer.msg("请至少填写一个查询条件，否则数据量太大无法导出", { icon: 5 });
                    }
                    location.href = "/Report/ExportMaterioaReport?" + params.join("&");
                });

                queryTable();
                function queryTable(forms) {
                    options.page.curr = 1;
                    if (table.index <= 0) {
                        table.render(options);
                    } else {
                        options.where = forms;
                        table.reload("table", options);
                    }
                }
            });
        }

        function detail(barCode) {
            parent.layui.index.openTabsPage("/Report/ComponentDetail?barCode=" + barCode, "组件详情(" + barCode + ")");
        }
    </script>
}
